<template>
	<!-- hover-stay-time 手指松开后点击态保留时间，单位毫秒 -->
	<view class="box" hover-class="boxHover">
		<view class="inner" hover-class="innerHover" hover-stop-propagation>内部元素</view>
	</view>
	<text selectable space="emsp">text文本    标签</text>
	<scroll-view scroll-y class="scrollView1">
		<view>scroll子元素</view>
		<view>scroll子元素</view>
		<view>scroll子元素</view>
		<view>scroll子元素</view>
	</scroll-view>
	<scroll-view scroll-x class="scrollView2">
		<view class="box">scroll子元素</view>
		<view class="box">scroll子元素</view>
		<view class="box">scroll子元素</view>
		<view class="box">scroll子元素</view>
	</scroll-view>
	<view>
		<navigator url="/pages/demo1/demo1" open-type="reLaunch">跳转到demo1</navigator>
		<navigator url="/pages/demo2/demo2">
			<image src="../../static/pic4.jpg" mode=""></image>
		</navigator>
	</view>
</template>

<script setup>
	
</script>

<style lang="scss">
.box {
	width: 200px;
	height: 200px;
	background: #ccc;
}
.boxHover {
	background: orange;
	width: 300px;
}
.inner {
	width: 150px;
	height: 150px;
	background: green;
}
.innerHover {
	background: greenyellow;
}
.scrollView1 {
	width: 80%;
	height: 50px;
	border: 1px solid red;
}
.scrollView2 {
	width: 80%;
	height: 200px;
	border: 1px solid red;
	white-space: nowrap;
	.box {
		width: 100px;
		height: 100px;
		background: green;
		display: inline-block;
		margin: 5px;
	}
}
</style>
